<style>
.tree {
  /*margin-top: 42px;*/
  border: 1px solid #d7dde4;
  /* max-height: 600px; */
}
.prodShow {
  z-index: 10000;
}
</style>
<template>
<Row class="layout-content-body">
  <Card>
    <p slot="title">技术人员变更信息</p>
    <Form ref='info' :model="formItem" :label-width="80">
      <Form-item label="名称" prop="Name">
        <Input v-model="formItem.Name" placeholder="请输入" disabled></Input>
      </Form-item>
      <Form-item label="单位" prop="DeptName">
        <Input v-model="formItem.DeptName" placeholder="请输入" disabled></Input>
      </Form-item>
       <Form-item label="操作类型" prop="CustName">
        <!-- <Input v-model="formItem.Optype" placeholder="请输入" disabled></Input> -->
        <RadioGroup v-model="formItem.Optype">
        <Radio :label="0" disabled>新增</Radio>
        <Radio :label="1" disabled>修改</Radio>
        <Radio :label="2" disabled>删除</Radio>
        <Radio :label="3" disabled>其他</Radio>
    </RadioGroup>
      </Form-item>
       <Form-item label="责任人" prop="CustName">
        <Input v-model="formItem.Creater" placeholder="请输入" disabled></Input>
      </Form-item>
       <Form-item label="创建时间" prop="CustName">
        <Input v-model="formItem.Ctime" placeholder="请输入" disabled></Input>
      </Form-item>

    </Form>
  </Card>
  <Card>
    <p slot="title">变更明细</p>
    <Table :columns="columns" :data="dataAll" :hover-show="true"></Table>
  </Card>
  <Card>
    <p slot="title">已审批信息</p>
    <Table :columns="approvecolumns" :data="approves"></Table>
    <br>
    <Steps :current="current" :status="status">
      <Step v-for="item in approves" :title="item.Text"
      :content="item.Approver + getResult(item.Result,item.Status)+'，审核时间：'+foramt(item.Atime) "
      :key="item.Text"></Step>
    </Steps>
  </Card>
  <Card v-if="orderData.edit">
    <p slot="title">审批意见</p>
    <Form ref="editForm" :model="approveItem" :label-width="80" :rules="ruleValidate">
      <FormItem label="是否同意" prop="Result">
        <RadioGroup v-model.number="approveItem.Result" required>
          <Radio :label="1">同意</Radio>
          <Radio :label="2">不同意</Radio>
        </RadioGroup>
      </FormItem>
      <FormItem label="审批意见" prop="Opinions" required>
        <Input v-model="approveItem.Opinions" placeholder="审批意见..."></Input>
      </FormItem>
      <FormItem label="备注" prop="Remark">
        <Input v-model="approveItem.Remark" required type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder="备注..."></Input>
      </FormItem>
      <FormItem>
        <Button type="primary" @click="handleSubmit('editForm')">提交</Button>
        <Button type="ghost" style="margin-left: 8px">取消</Button>
      </FormItem>
    </Form>
  </Card>
</Row>
</template>

<script>
import {
  getData
} from '@/common/utils'
import {
  timeFormat
} from '@/common/filter'
import dtable from '@/components/table/etable.vue' //

// import prod from '@/views/busy/prod'
import moment from 'moment'
// var list = []
// var item = {}
export default {
    data () {
        return {
            loading: false, // 数据刷新遮罩层
            approves: [],
            recive: [],
            current: 0,
            status: 'wait',
            approvecolumns: [
        // 多选框
                {
                    title: '名称',
                    key: 'Text',
                    sortable: true
                },
                {
                    title: '审批人',
                    key: 'Approver',
                    sortable: true
                },
                {
                    title: '审批意见',
                    key: 'Opinions',
                    sortable: true
                },
                {
                    title: '审批状态',
                    key: 'Result',
                    sortable: true,
                    render: (h, params) => {
                        let str = ''
                        if (params.row.Result === 1) {
                            str = '同意'
                        } else if (params.row.Result === 2) {
                            str = '不同意'
                        } else {
                            if (params.row.Status === 1) {
                                str = '正在处理'
                            } else if (params.row.Status === 2) {
                                str = '已通过'
                            } else {
                                str = '未开始'
                            }
                        }
                        return h('span', {}, str)
                    }
                },
                {
                    title: '审批时间',
                    key: 'Atime',
                    sortable: true,
                    render: (h, params) => {
                        return h('div', [
                            h('strong', timeFormat(getData(params.row.Atime)))
                        ])
                    }
                }
            ], // 表格样式
            columns: [
                {
                    title: '姓名',
                    key: 'Name',
                    fixed: 'left',
                    width: 130,
                    render: (h, params) => {
                        return h('div', [
                            h('Icon', {
                                props: {
                                    type: 'person'
                                }
                            }),
                            h('strong', params.row.Name)
                        ])
                    }
                },
                {
                    title: '性别',
                    key: 'Sex',
                    width: 100,
                    render: (h, { row }) => {
                        return h('span', {}, row.Sex === 0 ? '男' : '女')
                    }
                },
                {
                    title: '出生年月',
                    key: 'Birth',
                    width: 120,
                    render: (h, { row, column, index }) => {
                        return h('span', {}, moment(row.Birth).format('YYYY-MM-DD'))
                    }
                },
                {
                    title: '学历',
                    key: 'Xueli',
                    width: 100,
                    render: (h, { row }) => {
                        let str = ''
                        switch (row.Xueli) {
                        case 0:
                            str = '本科'
                            break
                        default:
                            str = '其它'
                            break
                        }
                        return h('span', {}, str)
                    }
                },
                {
                    title: '学历获得',
                    key: 'Xuelihuode',
                    width: 100,
                    render: (h, { row }) => {
                        let str = ''
                        switch (row.Xuelihuode) {
                        case 0:
                            str = '全日制'
                            break
                        case 1:
                            str = '函授'
                            break
                        case 2:
                            str = '成人'
                            break
                        default:
                            str = '其它'
                            break
                        }
                        return h('span', {}, str)
                    }
                },
                {
                    title: '毕业院校及专业',
                    width: 150,
                    key: 'Biyeyuanxiaojizhuanye'
                },
                {
                    title: '毕业时间',
                    key: 'Biyeshijian',
                    width: 100,
                    render: (h, { row, column, index }) => {
                        return h('span', {}, moment(row.Biyeshijian).format('YYYY-MM-DD'))
                    }
                },
                {
                    title: '参加工作时间及单位',
                    key: 'Gongzuoshijiandanwei',
                    width: 150
                },
                {
                    title: '参加技术工作时间及单位',
                    key: 'Jishugongzuoshijiandanwei',
                    width: 150
                },
                {
                    title: '现从事专业',
                    key: 'Xianzhuanye',
                    width: 150
                },
                {
                    title: '取得专业技术资格及时间',
                    key: 'Qudejishuzigeshijian',
                    width: 150
                },
                {
                    title: '是否具有鉴定资格',
                    width: 80,
                    key: 'Jaindingzige',
                    render: (h, { row, column, index }) => {
                        return h('span', {}, row.Jaindingzige === 1 ? '是' : '否')
                    }
                },
                {
                    title: '现所在单位',
                    width: 100,
                    key: 'Suozaibumen'
                },
                {
                    title: '是否现场勘察人员',
                    width: 80,
                    key: 'Kancha',
                    render: (h, { row, column, index }) => {
                        return h('span', {}, row.Kancha == 1 ? '是' : '否')
                    }
                }
            ], // 表格样式
            summary: {
                Name: '合计',
                Money: 0
            },
            dataAll: [], // 表格数据来源含合计
            datas: [], // 表格数据来源
            formItem: {
                Id: '',
                Name: '',
                CustName: '',
                Remark: '',
                Price: 0,
                DiscountPrice: 0,
                Off: 0
            }, // 数据编辑表单
            approveItem: {
                Opinions: '',
                Result: 1,
                Remark: ''
            }, // 数据编辑表单
            ruleValidate: {
                Opinions: [{
                    required: true,
                    message: '意见不能为空',
                    trigger: 'blur'
                }],
                Result: [
                    {type: 'number', required: true, message: '必须选择审批状态', trigger: 'change' }
                ]
            }, // 数据编辑表单验证规则
            addid: true, // true为修改模式，false为添加模式
            salesAd: false,
            custShow: false,
            prodShow: false,
            salesShow: false,
            total: 0,
            orderData: this.$route.params.orderData
        }
    },
    components: {
        dtable
    },
    computed: {},
    props: {},
    watch: {},
    methods: {
        getResult (r, s) {
            if (r === 1) {
                return '同意'
            } else if (r === 2) {
                return '不同意'
            } else {
                if (s === 1) {
                    return '正在处理'
                } else {
                    return '未开始'
                }
            }
        },
        getindex (data) {
            return data + 1
        },
        foramt (t) {
            return timeFormat(getData(t))
        },
        getSummaryMoney () {
            let sum = 0
            if (this.datas) {
                for (let m in this.datas) {
                    sum = sum + this.datas[m].Money
                }
            }
            return sum
        },
        getall () {
            if (!this.orderData || !this.orderData.order) {
                this.$router.push({
                    name: '技术人员变更',
                    params: {
                        tab: '2'
                    }
                })
                return
            }
            this.loading = true
            this.formItem = this.orderData.order
            console.log('formItem', this.formItem)
            this.$api.GetInstanceItem({Id: this.orderData.order.Id}).then(res => {
                if (!res.error) {
                    console.log(res)
                    this.dataAll = res.Data.sales
                    this.recive = getData(res.Data.receiv)
                    this.ReceivePercent()
                    this.loading = false
                } else {
                    this.$Message.error(res.message)
                }
            })
            this.$api.GetStateinsByBusy(this.orderData.order.Id).then(res => {
                if (!res.error) {
                    this.approves = res.Data.states
                    this.current = res.Data.current
          // this.currentState=res.Data.currentState
                    this.approveItem = res.Data.currentState
                    this.approveItem.Result = 1
                    console.log(this.approves)
                } else {
                    this.$Message.error(res.message)
                }
            })
        },
        ReceivePercent () {
            let len = this.recive.length,
                pos = 0
            let sum = this.formItem.DiscountPrice
            while (pos < len) {
                this.recive[pos].Percent = this.recive[pos].Money / sum * 100
                pos += 1 // 并从下个位置开始搜索
            }
            return
        },
        handleSubmit (name) {
            this.$refs[name].validate((valid) => {
                if (valid) {
                    console.log(this.approveItem)
                    this.$api.FlowApprove(this.approveItem).then(res => {
                        if (!res.error) {
                            this.$Message.success(res.message)
                            this.$router.push({
                                name: '技术人员变更',
                                params: {
                                    tab: '3'
                                }
                            })
                        } else {
                            this.$Message.error(res.message, 4)
                        }
                    })
                } else {
                    this.$Message.error('表单验证失败!')
                }
            })
        },
        handleReset (name) {}

    },
    mounted () {
        this.getall()
    }
}
</script>
